<template>
  <w-modal ref="WModal" title="修改访问页面权限" :success-func="successFunc">
    <template v-sloat:default>
      <a-tree
        :tree-data="allPages"
        :checked-keys="checkedKeys"
        checkable
        :replace-fields="{ key: 'path' }"
        @check="checkChange"
      />
    </template>
  </w-modal>
</template>

<script lang="ts">
import { Vue, Component } from 'vue-property-decorator'
import { Admin } from '@/config/api'
import WModal, { ModalFormComType } from '@/components/global/modal/form'

@Component({
  name: 'ComAdminAuthRolePagePop',
  components: {
    WModal
  }
})
export default class Com extends Vue {
  /**
   * 原数据
   */
  souceData = null;
  /**
   * 所有界面
   */
  allPages = [];
  /**
   * 角色模型
   */
  roleModel: any = null;
  // 选中的数据
  checkedKeys: Array<string> = [];

  mounted () {
    this.getPages()
  }

  /**
   * 显示
   */
  show (model: any) {
    this.roleModel = model;
    (this.$refs.WModal as ModalFormComType).show()
    this.checkedKeys = model.pages
    this.allPages = JSON.parse(JSON.stringify(this.souceData))
  }

  checkChange (checkedKeys: Array<string>) {
    this.checkedKeys = checkedKeys
  }

  async successFunc () {
    await this.$wAxios.$put(`${Admin.auth.role.update}${this.roleModel._id}`, {
      pages: this.checkedKeys
    })
    this.$emit('reload')
  }

  /**
   * 获取所有分页数据
   */
  getPages () {
    this.$wAxios
      .$get(Admin.auth.page.all)
      .then((data) => {
        this.souceData = data
      })
      .catch(() => {})
  }
}
</script>

<style scoped></style>
